<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <link rel="stylesheet" type="text/css" href="./css/aui.css" />
    <link rel="stylesheet" type="text/css" href="./css/style.css" />
    <link rel="stylesheet" type="text/css" href="./css/aui-slide.css" />
    <script type="text/javascript" src="./script/jquery.min.js"></script>
</head>

<body>
    <header class="aui-bar aui-bar-nav">
        <a class="aui-pull-left" tapmode onclick="closeWin()">
            <span class="aui-iconfont aui-icon-left"></span>
        </a>
        <div class="aui-title">收益计算器</div>
    </header>
    <div class="aui-bar-nav-d"></div>

    <div class="calculator">
        <ul>
            <li>
                <label>投资金额</label>
                <input type="number" id="invest" placeholder="请输入金额" min="0.0">
                <span>元</span>
            </li>
            <li>
                <label>投资期限</label>
                <input type="number" id="limit" placeholder="请输入期限" mim="1">
                <span>月</span>
            </li>
            <li>
                <label>年化收益</label>
                <input type="number" id="rate" placeholder="请输入收益率" min="0.0">
                <span>%</span>
            </li>
        </ul>
        <ul>
            <li>
                <label>预期收益</label>
                <input type="number" readonly="readonly" id="money">
                <span>元</span>
            </li>
        </ul>
        <button class="btn-1" onclick="count_money()">开始计算</button>
        <button class="btn-2" onclick="remove()">清空数据</button>
    </div>


</body>
<script type="text/javascript">
    function closeWin() {
        api.closeWin({});
    }

    function count_money() {
        var invest = $("#invest").val();
        var limit = $("#limit").val();
        var rate = $("#rate").val();

        if (isNaN(invest) || invest == '') {
            alert('投资金额请输入正确的数字或者小数');
            return false;
        }
        if (invest < 0) {
          alert('投资金额不能为负');
          return false;
        }

        if (isNaN(limit) || limit == '') {
            alert('投资期限请输入正确的数字或者小数');
            return false;
        }
        if (limit < 0) {
          alert('投资金额不能为负');
          return false;
        }

        if (isNaN(rate) || rate == '') {
            alert('年化收益请输入正确的数字或者小数');
            return false;
        }
        if (rate < 0) {
          alert('年化收益不能为负');
          return false;
        }

        var money = invest * limit * rate / 12 / 100;
        $('#money').val(money);
    }

    function remove() {
        $('#invest').val("");
        $('#limit').val("");
        $('#rate').val("");
        $('#money').val("");
    }
</script>

</html>
